<!-- 添加内容评价 -->
<template>
    <div class="add-comment-container">
        <el-input
            class="srt-el-textarea"
            v-model="comment"
            :rows="5"
            type="textarea"
            :maxlength="500"
            show-word-limit
            placeholder="可以在此发表您对该节内容的看法"
        />
        <div class="submit-btn-wrap">
            <el-button class="srt-el-button srt-el-button--primary btn-h34 w-98" :loading="loading" @click="submit">发表讨论</el-button>
        </div>
    </div>
</template>

<script setup>
import { ref } from 'vue';
import { queryToJson } from '@/lib/tools';
import { useRoute } from 'vue-router';

const route = useRoute();

const emit = defineEmits(['update:list']);

const props = defineProps({
    isPreview: {
        type: Boolean,
        default: false
    }
})

const loading = ref(false);


// 评论内容
const comment = ref('');


// 发表评价 预览状态下不能发表评价
function submit () {
    if (props.isPreview) {
        G_dispatchEvent('toast', { message: '预览状态下不可操作', type: 'error'});
        return
    }
    if (!!comment.value && !!comment.value.trim() && comment.value.trim().length >= 2) {
        let catalogueId = queryToJson().catalogueId;
        let params = {
            content: comment.value,
            bizId: catalogueId,
            parentSource: route.params.moocId,
            bizSource: 'mooc',
            serviceName: 'kms-center',

            commentLevel: 1, // 层级(1:一级评论, 2:二级评论 n:n级评论）
            parentCommentId: 0, // 父级评论ID 一级评论传0
            top: 0, // 是否置顶 0：否 1：是
            parentCommentAnonymous: 0, // 被回复的评论是否匿名 1-匿名 0-实名 
            beReplyUserId: 0, // 被回复的人的ID
            anonymous: 0, // 匿名 1-匿名 0-实名
            topParentCommentId: 0
        }
        loading.value = true;
        G_transmit('saveCatalogueComment', {
            data: params
        }).then((res) => {
            comment.value = '';
            G_dispatchEvent('toast', { message: '发表成功', type: 'success'});
            emit('update:list');
        }).catch(_err => {
            console.log(_err);
        }).finally(() => {
            loading.value = false;
        })
    } else {
        G_dispatchEvent('toast', { message: '请输入正确的讨论内容，至少2个字', type: 'error'});
    }
}

</script>

<style lang="scss" scoped>
.add-comment-container {
    .submit-btn-wrap {
        text-align: right;
        margin-top: 20px;
        .btn-h34 {
            font-size: 14px;
            padding: 0 24px;
            min-height: 34px;
        }
    }
    :deep(.srt-el-textarea) {
        .el-textarea__inner {
            padding: 10px 12px;
            color: var(--srt-main-text-color);
        }
    }
    .w-98 {
        width: 98px;
    }
}
</style>
